<style>
</style>


<template>

  <div id="salesOrder">
      <!-- 出库 -->

      <!-- 加载特效 --> 
        <Spin size="large" fix v-if="spinShow"></Spin>


    <!-- 根据条件查询 -->


  


    <div>
        <!-- table标签页    -->
    <template>
  <el-tabs v-model="activeName" type="card" >



      <!--******************** 待入库**************8 -->
    <el-tab-pane label="待出库" name="first">

      <!-- 查询 -->
          <div>
      <el-form :inline="true"  class="demo-form-inline" ref="ruleForm">
        <el-form-item label="单据编号">
          <el-input v-model="documentNumber" placeholder="请输入单据编号查询"></el-input>
        </el-form-item>
        <el-form-item label="商品信息">
          <el-input v-model="productName" placeholder="请输入商品信息查询"></el-input>
        </el-form-item>
        <el-form-item label=" 单据日期 ">
          <el-date-picker
            v-model="begintime"
            type="datetimerange"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :default-time="['12:00:00']"
          ></el-date-picker>
        </el-form-item>
        <el-form-item>
          <!-- <el-button type="primary" @click="getAwaitstoragePage1">查询</el-button> -->
          <el-button type="primary" plain   @click="getAwaitstoragePage1">查询</el-button>
          <el-button @click="resetForm">重置</el-button>
        </el-form-item>
      </el-form>
    </div>



      <!-- table展示 -->
       <Table border ref="selection" :columns="columns4" :data="data1" @on-selection-change="select2">
        <template slot-scope="{ row, index }" slot="action">
          <!-- <Button type="info" size="large" @click="ouputRR(row)">出库</Button> -->
                  <el-button type="info" plain  @click="ouputRR(row)">出库</el-button>
        </template>

        <template slot-scope="{ row, index }" slot="action3">
          <!-- <Button type="info" size="large" @click="preAwaitW(row)" >退货</Button> -->
             <el-button type="danger" plain   @click="preAwaitW(row)">退货</el-button>
        </template>



         <template  slot-scope="scope" slot="type">
          <!-- {{scope.row.erpCommoditystyle.classificationName}} -->
          <span>{{scope.row.erpCommoditystyle.classificationName}}</span>
        </template>

        <template  slot-scope="scope" slot="wid">
          <!-- {{scope.row.erpCommoditystyle.classificationName}} -->
          <span >{{scope.row.erpWarehouseinformation.resName}}</span>
        </template>
      </Table>
  <br>
      
  <!-- 分页 -->
 <div style="float:right">
      <Page
        :total="dataCount"
        :page-size="pageSize"
        @on-change="changepage"
        @on-page-size-change="_nowPageSize"
        show-elevator
      />
    </div>
    </el-tab-pane>


      <!--******************** 已出库**************8 -->
    <el-tab-pane label="已出库" name="second">
      <!-- 查询 -->
    <div>
      <el-form :inline="true"  class="demo-form-inline" ref="ruleForm">
        <el-form-item label="单据编号">
          <el-input v-model="documentNumber" placeholder="请输入单据编号查询"></el-input>
        </el-form-item>
        <el-form-item label="商品信息">
          <el-input v-model="productName" placeholder="请输入商品信息查询"></el-input>
        </el-form-item>
        <el-form-item label=" 单据日期 ">
          <el-date-picker
            v-model="begintime"
            type="datetimerange"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :default-time="['12:00:00']"
          ></el-date-picker>
        </el-form-item>
        <el-form-item>
          <!-- <el-button type="primary" @click="getAlreadystoragePage1">查询</el-button> -->
           <el-button type="primary" plain   @click="getAlreadystoragePage1">查询</el-button>
          <el-button @click="resetForm">重置</el-button>
        </el-form-item>
      </el-form>
    </div>

    <el-button type="primary" plain   @click="exportExcel">导出</el-button>
       <br><br>



          <Table class="table" border ref="selection" :columns="columns5" :data="data2" @on-selection-change="select2" height="350" >
        <template slot-scope="{ row, index }" slot="action">
          <!-- <Button type="info" size="large" @click="PreAearyreturnW(row)">退货</Button> -->
              <el-button type="danger" plain   @click="PreAearyreturnW(row)">退货</el-button>
        </template>
       

         <template  slot-scope="{ row, index }" slot="type">
          <span >{{row.erpCommoditystyle.classificationName}}</span>
        </template>

        <template  slot-scope="scope" slot="wid">
          <span >{{scope.row.erpWarehouseinformation.resName}}</span>
        </template>

         <template  slot-scope="scope" slot="productName">
          <span >{{scope.row.productName}}</span>
        </template>

        
      </Table>
      <br>

      
  <!-- 分页 -->
 <div style="float:right">
      <Page
        :total="dataCount2"
        :page-size="pageSize2"
        @on-change="changepage2"
        @on-page-size-change="_nowPageSize2"
        show-elevator
      />
    </div>
        </el-tab-pane>
  </el-tabs>
</template>
    </div>


  <br>


    <!-- 出库 -->
  <Modal
        v-model="outputS"
        title="警告"
        
        @on-ok="OnputRes">
        <p>确定要出库吗?</p>
    </Modal>



    <!-- //已经出库中退货 -->
 <!-- 修改的弹出框 -->
     <Modal
        width="1000"
        v-model="r1"
        title="退货"
         @on-ok="AAALearW"
        >

       <el-form :inline="true" :model="returnW" class="demo-form-inline">
         <el-form-item label="单据编号:">
              <el-input v-model="returnW.documentNumber"  disabled=""></el-input>
            </el-form-item> 

                        
               <el-form-item label="仓库:">
              <el-input v-model="returnW.resName"  disabled=""></el-input>
            </el-form-item> 

            <el-form-item label="id:">
                    <el-input v-model="returnW.id" disabled=""></el-input>
            </el-form-item>



              
         <br>

          <el-form-item label="商品名称:">
                    <el-input v-model="returnW.productName" disabled=""></el-input>
            </el-form-item>
         

             <el-form-item label="数量:">
              <el-input v-model="returnW.num" ></el-input>
            </el-form-item> 

            <el-form-item label="单价:">
              <el-input v-model="returnW.unitPrice" disabled=""  ></el-input>
            </el-form-item>   
       </el-form>



    </Modal>


       <!-- //等待出库中退货 -->
 <!-- 修改的弹出框 -->
     <Modal
        width="1000"
        v-model="r2"
        title="退货"
        @on-ok="AwreturnW1"
       
        >

       <el-form :inline="true" :model="returnW2" class="demo-form-inline">
         <el-form-item label="单据编号:">
              <el-input v-model="returnW2.documentNumber"  disabled=""></el-input>
            </el-form-item> 

                        
               <el-form-item label="仓库:">
              <el-input v-model="returnW2.resName"  disabled=""></el-input>
            </el-form-item> 

            <el-form-item label="id:">
                    <el-input v-model="returnW2.id" disabled=""></el-input>
            </el-form-item>



              
         <br>

          <el-form-item label="商品名称:">
                    <el-input v-model="returnW2.productName" disabled=""></el-input>
            </el-form-item>
         

             <el-form-item label="数量:">
              <el-input v-model="returnW2.num" ></el-input>
            </el-form-item> 

            <el-form-item label="单价:">
              <el-input v-model="returnW2.unitPrice" disabled=""  ></el-input>
            </el-form-item>   
       </el-form>



    </Modal>


   

  
  </div>
</template>


<script>
import axios from "axios";
import FileSaver from "file-saver";
import XLSX from "xlsx";
export default {
  data() {
    return { 

      //退货的model
      r1:false,
       r2:false,

      //修改对象
      returnW:{},
      returnW2:{},



      outputS:false,
      outputId:"",


        //特效
        spinShow:true,

       data1: [
        

       ],
       data2: [],
        columns4: [
                      {
                        type: 'selection',
                        width: 60,
                        align: 'center'
                    },
                    {
                        title: '#',
                        key: 'id',
            align:"center",
                    },
                    {
                        title: '供应商',
                        key: 'supplier',
            align:"center",
                    },
                    {
                        title: '单据编号',
                        key: 'documentNumber',
            align:"center",
                    },
                      {
                        title: '单据时间',
                        key: 'documentDate',
            align:"center",
                    },
                     {
                        title: '商品名称',
                        key: 'productName',
            align:"center",
                    },
                   
                     {
                        title: '总金额',
                        key: 'totalAmount',
            align:"center",
                    },   
                       {
                        title: '数量',
                        key: 'num',
            align:"center",
                    },
                      {
                        title: '商品类型',
                        slot: 'type',
            align:"center",
                    },
                       {
                        title: '仓库id',
                        slot: 'wid',
            align:"center",
                    },                
              
                    {
                       title: "用户操作",
                      slot: "action",
            align:"center",
                    },
                     {
                       title: "用户操作",
                      slot: "action3",
            align:"center",
                    },
                   
                  
                ],
                 columns5: [
                     {
                        type: 'selection',
                        width: 60,
                        align: 'center'
                    },
                    {
                        title: '#',
                        key: 'id',
            align:"center",
                    },
                    {
                        title: '供应商',
                        key: 'supplier',
            align:"center",
                    },
                    {
                        title: '单据编号',
                        key: 'documentNumber',
            align:"center",
                    },
                      {
                        title: '出库时间',
                        key: 'deliveryTime',
            align:"center",
                    },
                     {
                        title: '商品名称',
                        slot: 'productName',
            align:"center",
                    },
                   
                     {
                        title: '总金额',
                        key: 'totalAmount',
            align:"center",
                    },   
                       {
                        title: '数量',
                        key: 'num',
            align:"center",
                    },
                      {
                        title: '商品类型',
                        slot: 'type',
            align:"center",
                    },
                       {
                        title: '仓库id',
                        slot: 'wid',
            align:"center",
                    },                
              
                    {
                       title: "用户操作",
                      slot: "action",
            align:"center",
                    }
                   
                ],
               

        //标签页默认  默认未入库
        activeName: 'first',



     
        //刷新  更新
        // spinShow:true,


      pageSize: 5, //每页显示多少条
      dataCount: 0, //总条数
      pageCurrent: 1, //当前页,
      width: 100,

       pageSize2: 5, //每页显示多少条
      dataCount2: 0, //总条数
      pageCurrent2: 1, //当前页,

      // 分页的条件
      productName: "",
      documentNumber: "",
      begintime: [],

  
      // table多选框的值
      tableSelection: [],
    }
  },

  // 挂载
  created() {
  this.getAwaitstoragePage1();
  this.getAlreadystoragePage1();

  },

  methods: {
   
  //  等待出库list分页
    getAwaitstoragePage1() {
     //开启特效
     this.spinShow=true;
      axios
        .post(
          "//localhost:8082/Awaitwarehouse/getAwaitwarehousePage1?documentNumber=" +
            this.documentNumber +
            "&productName=" +
            this.productName +
            "&time=" +
            this.begintime +
            "&pageSize=" +
            this.pageSize +
            "&pageCurrent=" +
            this.pageCurrent
        )
        .then(res => {
          //console.log(res.data);
          this.data1=res.data.list
          this.dataCount = res.data.countTotal;
          //console.log(this.data1)
         
          console.log(this.data1)
          //关闭特效
         this.spinShow=false;
        });
    },

    //  已经出库list分页
    getAlreadystoragePage1() {
      //开启特效
     this.spinShow=true;
      axios
        .post(
          "//localhost:8082/Alreadywarehouse/getAlreadywarehousePage1?documentNumber=" +
            this.documentNumber +
            "&productName=" +
            this.productName +
            "&time=" +
            this.begintime +
            "&pageSize=" +
            this.pageSize +
            "&pageCurrent=" +
            this.pageCurrent
        )
        .then(res => {
          console.log(res.data);
          this.data2=res.data.list
          this.dataCount2 = res.data.countTotal;
           console.log("12111111111111111113")
           console.log( this.data2)
          //console.log(this.data1.erpWarehouseinformation)
             //关闭特效
         this.spinShow=false;
        });
    },


     //点击这个,即可换页数
    changepage2(index) {
      //开启特效
     this.spinShow=true;
     axios
        .post(
          "//localhost:8082/Alreadywarehouse/getAlreadywarehousePage1?documentNumber=" +
            this.documentNumber +
            "&productName=" +
            this.productName +
            "&time=" +
            this.begintime +
            "&pageSize=" +
            this.pageSize +
            "&pageCurrent=" +
            index
        )
        .then(res => {
          // console.log(res.data);
          this.data2=res.data.list
          this.dataCount2 = res.data.countTotal;
    
          //当从数据库获取完毕  关闭加载特效
          this.spinShow=false;
         
        });
    
    },

    //每页显示的数据条数
    _nowPageSize2(index) {
      //实时获取当前需要显示的条数
      this.pageSize = index;
    },




    //点击这个,即可换页数
    changepage(index) {
      //开启特效
     this.spinShow=true;
     axios
        .post(
          "//localhost:8082/Awaitwarehouse/getAwaitwarehousePage1?documentNumber=" +
            this.documentNumber +
            "&productName=" +
            this.productName +
            "&time=" +
            this.begintime +
            "&pageSize=" +
            this.pageSize +
            "&pageCurrent=" +
            index        
            )
        .then(res => {
          // console.log(res.data);
          this.data1=res.data.list
          this.dataCount = res.data.countTotal;
          //当从数据库获取完毕  关闭加载特效
          this.spinShow=false;
          
        });
    },

    //每页显示的数据条数
    _nowPageSize(index) {
      //实时获取当前需要显示的条数
      this.pageSize = index;
    },



    
 


    // 重置
    resetForm() {
      this.documentNumber = "";
      this.begintime = [];
      this.productName = "";
    },

    // 当选中的时候触发   没有选中不触发
    select2(rows) {
      this.tableSelection = rows;
      //console.log(this.tableSelection);
    
      if (this.tableSelection.length == 0) {
        
      }
    },

//打开出库框
    ouputRR(row){
      this.outputId=row.id;
      this.outputS=true;
    },


//ok确定出库
    OnputRes(){
         axios.post("//localhost:8082/Awaitwarehouse/ouputRRR?id="+this.outputId).then(res=>{
            if(res.data=="1"){
                 this.$notify({
          title: '成功',
          message: '恭喜你,出库成功',
          type: 'success'
            });
            this.getAwaitstoragePage1();
            this.getAlreadystoragePage1();
            }else{
          this.$notify({
          title: '警告',
          message: '入库失败!',
          type: 'warning'
        });
            }
        })
    },


    //预已经出库中的退货
    PreAearyreturnW(row){
      this.returnW=row;
        this.returnW.resName=row.erpWarehouseinformation.resName;
        this.r1=true;
        console.log(this.returnW)
    },

    AAALearW(){
      axios.post("//localhost:8082/Alreadywarehouse/ReturnalearyW2",this.returnW).then(res=>{
        this.spinShow=true;
          if(res.data==1){
          this.$notify({
          title: '成功',
          message: '恭喜你,退货成功',
          type: 'success'
            });
          }else if(res.data==2){
             this.$notify({
          title: '警告',
          message: '请您减少商品的数量才可退货!',
          type: 'warning'
        });
          }else if(res.data==3){
             this.$notify({
          title: '警告',
          message: '退货数量不可以为负数!',
          type: 'warning'
        });
          }
        
          else{
          this.$notify({
          title: '警告',
          message: '退货失败!',
          type: 'warning'
        });
          }
          this.getAlreadystoragePage1();
          this.spinShow=false;
          
      })
    },







  //预出库,待出库中的退货
  preAwaitW(row){
  this.returnW2=row;
        this.returnW2.resName=row.erpWarehouseinformation.resName;
        this.r2=true;
  },

    AwreturnW1(){
      axios.post("//localhost:8082/Awaitwarehouse/ReturnAwaitW",this.returnW2).then(res=>{
            this.spinShow=true;
          if(res.data==1){
          this.$notify({
          title: '成功',
          message: '恭喜你,退货成功',
          type: 'success'
            });
          }else if(res.data==2){
             this.$notify({
          title: '警告',
          message: '请您减少商品的数量才可退货!',
          type: 'warning'
        });
          }else if(res.data==3){
             this.$notify({
          title: '警告',
          message: '退货数量不可以为负数!',
          type: 'warning'
        });
          }else{
          this.$notify({
          title: '警告',
          message: '退货失败!',
          type: 'warning'
        });
          }
            this.getAwaitstoragePage1();
          this.spinShow=false;
      })
    },

 // 导出表格所用
    exportExcel() {
      // 设置当前日期
      let time = new Date();
      let year = time.getFullYear();
      let month = time.getMonth() + 1;
      let day = time.getDate();
      let name = year + "" + month + "" + day;
      // console.log(name)
      /* generate workbook object from table */
      //  .table要导出的是哪一个表格
      var wb = XLSX.utils.table_to_book(document.querySelector(".table"));
      /* get binary string as output */
      var wbout = XLSX.write(wb, {
        bookType: "xlsx",
        bookSST: true,
        type: "array"
      });
      try {
        //  name+'.xlsx'表示导出的excel表格名字
        FileSaver.saveAs(
          new Blob([wbout], { type: "application/octet-stream" }),
          name + ".xlsx"
        );
      } catch (e) {
        if (typeof console !== "undefined") console.log(e, wbout);
      }
      return wbout;
    }

  

  }
};
</script>
